<template>
  <div ref="div" style="height:50px"></div>
</template>

<script>
import * as echarts from 'echarts'
export default {
  data() {
    return {
      myEcharts: null,
      source: [
        { num: 1, time: 1 },
        { num: 13, time: 2 },
        { num: 51, time: 3 },
        { num: 16, time: 4 },
        { num: 31, time: 5 },
        { num: 71, time: 6 },
        { num: 31, time: 7 }
      ]
    }
  },
  methods: {
    drawImg() {
      this.myEcharts.setOption({
        xAxis: { show: false },
        yAxis: { show: false },
        dataset: {
          source: this.source
        },
        grid: {
          top: 0,
          bottom: 0,
          left: 0,
          right: 0
        },
        series: {
          type: 'bar',
          encode: {
            x: 'time',
            y: 'num'
          }
        }
      })
    }
  },
  mounted() {
    this.myEcharts = echarts.init(this.$refs.div)
    this.drawImg()
  }
}
</script>

<style></style>
